<template>
	<view class="fruit-admin-collate-body-container">
		<view class="fruit-admin-collate-item" v-for="(item,index) in data.fruitItemList" :key="index">
			<view class="fruit-admin-collate-item-title">{{item.name}}</view>
			<view class="choice">
				<view @tap="move(0,index)">上移</view>
				<view @tap="move(1,index)">下移</view>
			</view>
		</view>
	</view>
	<button @tap="sendCollate">确认顺序并发布</button>
</template>

<script>
	import {onMounted,reactive} from "vue"
	import global from '../../config/global.js'
	export default {
		name:"fruit-admin-collate",
		setup(props,context){
			let data = reactive({
				fruitItemList:[]
			})
			
			onMounted(()=>{
				uni.request({
					url:`${global.BASE_URL}/fruit/getValidFruitKind`,
					method:"GET",
					header:{
						"mytoken":uni.getStorageSync("localtoken")
					},
					success: (res) => {
						console.log(res)
						if(res.data.code){
							data.fruitItemList = res.data.data
						}
					},
					fail: (err) => {
						console.log(err)
					}
				})
			})
			
			function move(choice,id){
				if(choice == 0){
					if(id != 0){
						let t = data.fruitItemList[id]
						data.fruitItemList[id] = data.fruitItemList[id-1] 
						data.fruitItemList[id-1] = t
					}
				}else {
					if(id != data.fruitItemList.length-1){
						let t = data.fruitItemList[id]
						data.fruitItemList[id] = data.fruitItemList[id+1] 
						data.fruitItemList[id+1] = t
					}
				}
			}
			
			function sendCollate(){
				for(let i = 0;i< data.fruitItemList.length;i++){
					data.fruitItemList[i].status = i+1;
				}
				uni.request({
					url:`${global.BASE_URL}/fruit/reviseFruitKind`,
					method:"PUT",
					data:data.fruitItemList,
					header:{
						"mytoken":uni.getStorageSync("localtoken")
					},
					success: (res) => {
						// console.log(res)
						if(res.data.code){
							uni.showModal({
								showCancel:false,
								title:"修改成功",
								content:"即将返回主页",
								success: (res) => {
									if(res.confirm){
										uni.switchTab({
											url:"/pages/index/index"
										})
									}
								}
							})
						}
					},
					fail: (err) => {
						console.log(err)
					}
				})
			}
			
			return {
				data,
				move,
				sendCollate
			}
		}
	}
</script>

<style lang="scss" scoped>
	.fruit-admin-collate-body-container{
		width: 690rpx;
		margin: 10rpx 30rpx;
		
		& .fruit-admin-collate-item{
			padding: 10rpx 10rpx;
			border-bottom: 1rpx solid #cdcdcd;
			height: 80rpx;
			position: relative;
			display: flex;
			
			& .fruit-admin-collate-item-title{
				width: 450rpx;
				height: 80rpx;
				line-height: 80rpx;
			}
			
			& .choice{
				width: 250rpx;
				display: flex;
				position: absolute;
				right: 10rpx;
				text-align: center;
				height: 80rpx;
				line-height: 80rpx;
				
				view {
					text-decoration: underline;
					margin-left: 40rpx;
					font-size: 28rpx;
				}
				
			}
		}
	}
	
	button {
		background-color: #9BCDD2;
		color: white;
		width: 400rpx;
		margin: 50rpx 175rpx 10rpx 175rpx;
		height: 70rpx;
		line-height: 70rpx;
		font-size: 35rpx;
		// font-weight: bold;
	}
</style>
